<template>
  <div>
    <van-cell-group>
      <van-cell title="搜索历史">
        <span @click="deleteAll">
          全部删除
          <van-icon name="delete" /> </span>
      </van-cell>
    </van-cell-group>
    <van-cell-group>
      <van-cell
        @click="$emit('search',item)"
        :key="index"
        :title="item"
        v-for="(item,index) in list"
      >
        <van-icon
          name="cross"
          @click.stop="deleteItem(index)"
        />
      </van-cell>
    </van-cell-group>
  </div>
</template>
<script>
import { getItem, setItem } from '@/utils/storage.js'
export default {
  data () {
    return {
      list: getItem('searchHistory')
    }
  },
  methods: {
    deleteItem (i) {
      this.list.splice(i, 1)
      setItem('searchHistory', this.list)
    },
    deleteAll () {
      this.list = null
      setItem('searchHistory', this.list)
    }
  }
}
</script>
